{extend name="public:base" /}
{block name="css"}
<link rel="stylesheet" href="__ADMIN__/ztree/css/zTreeStyle/zTreeStyle.css">
{/block}
{block name="body"}
<div class="layui-card">
    <div class="layui-card-header">编辑数据</div>
    <div class="layui-card-body">
        <form action="{:request()->url()}" class="layui-form" method="post">
            <div class="layui-form-item">
                <label class="layui-form-label">用户组</label>
                <div class="layui-input-block">
                    <input type="text" name="name" value="{$data.name|default=''}" autocomplete="off" placeholder="请输入用户组" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">描述</label>
                <div class="layui-input-block">
                    <textarea name="description" placeholder="请输入描述" class="layui-textarea">{$data.description|default=''}</textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">授权</label>
                <div class="layui-input-block">
                    <input type="hidden" name="rules" value="{$data.rules|default=''}" id="rules">
                    <div  class="ztree" id="authRule"></div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-filter="*" lay-submit="">保存</button>
                    <button class="layui-btn layui-btn-primary" type="reset">重置</button>
                </div>
            </div>
        </form>
    </div>
</div>
{/block}
{block name="js"}
<script src="__ADMIN__/ztree/js/jquery.ztree.all.min.js"></script>
<script>
$.fn.zTree.init($("#authRule"), {
    check: {
        enable: true,
        chkboxType: {'Y': 'ps', 'N': 's'},
    },
    view: {
        dblClickExpand: false,
        showLine: true,
        showIcon: false,
        selectedMulti: false
    },
    edit: {
        enable: true,
        editNameSelectAll: true,
        showRemoveBtn: false,
        showRenameBtn: false
    },
    data: {
        simpleData: {
            enable: true
        }
    },
    callback: {
        onCheck: function () {
            var zTree = $.fn.zTree.getZTreeObj('authRule');
            var rules = [];
            $.each(zTree.getCheckedNodes(), function (i, z) {
                rules.push(z.id);
            });
            $('#rules').val(rules.join(','));
        }
    }
}, {$authRule});
</script>
{/block}